<template>
  <div class="app-container">
    <el-form :inline="true"  class="demo-form-inline">
      <el-form-item label="发明人名称：">
        <el-input
          v-model="inventorButton"
          placeholder="例如：李华"
          style="width: 325px"
        ></el-input>
      </el-form-item>
      <el-form-item>
          <el-button type="primary" @click="updateInventor();getInventorList()">查询</el-button>
      </el-form-item>

    </el-form>
    <detail ref="mydetail"> </detail>
    <!-- 表单 -->
    <template>
      <el-table
        :header-cell-style="{ background: '#eef1f6', color: '#606266' }"
        stripe
        :data="list"
        :cell-style="cellStyle"
        element-loading-text="数据加载中"
        border
        fit
        highlight-current-row
      >
        <el-table-column
          prop="Name"
          label="发明人名称"
          align="center"
        ><template slot-scope="scope">
            {{inventor.inventorName}}
        </template>
        </el-table-column>
        <el-table-column
         prop="Count" 
        label="专利数量" 
        width="340" 
        />
        
        <el-table-column 
        prop="Value" 
        label="所属企业" 
        width="340" >
        </el-table-column>

        <el-table-column
          label="创新力"
          width="240">
          <template slot-scope="scope">
            <!-- 三个等号 判断值和类型 -->
            <!-- <span v-if="scope.row.cited_num==='1'" style="color:#F56C6C">高价值专利</span>
            <span v-else> </span> -->
            <!-- {{ scope.row.value_score }}
            {{ scope.row.value_score >= 10 ? "(高价值专利)" : "" }} -->
            钻石
          </template>
        </el-table-column>

        <el-table-column 
        label="司法风险" 
        width="150">
          <template slot-scope="scope">
            <!-- 三个等号 判断值和类型 -->
            <!-- <span v-if="scope.row.cited_num==='1'" style="color:#F56C6C">高价值专利</span>
            <span v-else> </span> -->
            <!-- {{ scope.row.value_score }}
            {{ scope.row.value_score >= 10 ? "(高价值专利)" : "" }} -->
            12
          </template>
        </el-table-column>
        <!-- <el-table-column prop="inventor" label="发明人(inventor)" width="200" />
        <el-table-column prop="publication_day" label="公开日" />
        <el-table-column prop="cited_num" label="被引数" /> -->

        <!-- <el-table-column prop="patentWords" label="关键词" width="340"/> -->

        <el-table-column label="操作" width="200" align="center">
          <!-- slot-scope获取整个表格 -->
          <template slot-scope="scope">
            <router-link :to="'/inventor/detail/' + inventorButton + '/'+ scope.row.Value">
              <el-button type="primary" size="mini" icon="el-icon-share"
                >查看</el-button
              >
            </router-link>
            <el-button
              type="success"
              size="mini"
              icon="el-icon-circle-plus"
              @click="removeDataById(scope.row.id)"
              >收藏</el-button
            >
          </template>
        </el-table-column>
      </el-table>

      <!-- 分页条 -->

      <!-- 分页   @符号是绑定一个即v-on -->
      <!-- current-page：当前页 page-size：每页记录数  total：一共有多少记录数 @current-change="getList"：分页方法-->
      <el-pagination
        :current-page="page"
        :page-size="limit"
        :total="total"
        style="padding: 30px 0; text-align: center"
        layout="total, prev, pager, next, jumper"
        @current-change="getInventorList"
      />
    </template>
  </div>
</template>
  

<script>
export default {
  name: 'inventorList', 
  data() {
    return {
      inventor: {
        pageSize:"10",
        pageIndex:"1",
        kindCodeDesc:"FMZL,SYXX,WGZL,FMSQ"
      },
      list:null,
      page:1,//当前页
      limit:10,//每页显示的记录数
      total:100,//总记录是
      inventorButton:null,
    };
  },
  created(){
    //页面渲染之前执行，调用methods定义的方法
    //调用
    this.getInventorList();
  },
  methods: {
  updateInventor(){
      console.log("this.inventorButton")
      console.log(this.inventorButton)
      this.inventor.inventorName = this.inventorButton
  },
  getInventorList(page = 1){
      console.log("this.page")
      console.log(this.page)
      this.inventor.pageIndex = page
      console.log("this.inventor.pageIndex"),
      console.log(this.inventor.pageIndex),
      this.$axios({
        url:'/api/PatentSearchV3/tjapplicantbyinventor',
        method:'POST',
        headers:{
          'Content-Type':'application/json'
        },data:this.inventor
      }).then(res =>{

        console.log(res)
        this.list = res.data.Result;
        this.pageSize = res.data.Paging.TotalRecords
        console.log("this.pageSize")
        console.log(this.pageSize)
        console.log("this.list")
        console.log(this.list);
      })
      }
      // }.then(response => {    
      //   console.log(response.data)
      // })
  }
};
</script>

<style scoped>

</style>
